<style lang="scss" scoped>
@import '../../css/study-plan.scss';
.step-head{padding: 24px 20px 0 20px;background: #fff;position: relative;font-size: 18px;font-weight: bold;}
.step-one{float: left;background: $mcb;width:150px;height: 40px;line-height: 40px;text-align: center;margin-right: 58px;}
.triangel-left{display: inline-block;width: 0;height: 0;border:20px solid rgba(1,1,1,0);border-left: 20px solid $mcb;position: absolute;top:24px;left: 168px;}
.triangel-right{display: inline-block;width: 0;height: 0;border:20px solid $mcb;border-left: 20px solid rgba(1,1,1,0);position: absolute;top:24px;left: 180px;}
.step-two{margin-left: 190px;background: $mcb;height: 40px;line-height: 40px;color: #ccc;}

.main-content{padding: 24px 180px 80px 20px;background: #fff;}
.next-btn{padding: 10px 40px;margin-top: 30px;}
</style>

<template>
    <section class="build-plan-first">
        <div class="breadcrumb-box">
            <el-breadcrumb separator=" > ">
                <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
                <el-breadcrumb-item v-if="$route.meta">{{$route.meta.title}}</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="step-head">
            <span class="step-one">创建学习计划</span>
            <span class="triangel-left"></span>
            <span class="triangel-right"></span>
            <div class="step-two">编辑学习计划</div>
        </div>
        <div class="main-content">
            <el-form ref="form" label-width="180px">
                <el-form-item label="学习计划名称" class="pt30">
                    <el-input class="input" placeholder="请输入学习计划名称"></el-input>
                </el-form-item>
                <el-form-item label="学习计划备注">
                    <el-input class="input" placeholder="点击输入备注自己查看（选填）"></el-input>
                </el-form-item>
                <el-form-item label="学习计划简介">
                    <editor :content="form.content" v-model="content"></editor>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" class="next-btn">下一步</el-button>
                </el-form-item>
            </el-form>
        </div>

    </section>
</template>

<script>

import qs from 'qs'
import editor from 'components/wangeditor.vue'

export default{
    data: function(){
        return {
            form:{content:''}
        }
    },
    mixins: [mixinMethods],
    methods: {

    },
    mounted: function(){

        /*axios.post('/xxx', qs.stringify({})).then( (res) => {
            var d = res.data;
            if(d.flag == 1){
            }
        } )*/
    },
    components:{
        editor:editor
    }
}


</script>